<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title>新建网页</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="description" content="" />
        <meta name="keywords" content="" />

		<script src="../../js/jquery-1.11.3.js" type="text/javascript" charset="utf-8"></script>

        <script type="text/javascript">
        function f1(){
            //隐藏 hidden
            //hide([时间参数 毫秒级][,处理函数])
            $('div').hide(3000,function(){
                alert('我消失了，你能看到么');
            });
        }
        function f2(){
            //显示 show
            //show([时间参数 毫秒级][,处理函数])
            $('div').show(3000,function(){
                alert('我又回来了');
            });
            
        }
        function f3(){
            $('div').toggle(2000);
        }
        </script>

        <style type="text/css">
        	div {
        		width:300px; 
        		height:200px; 
        		background-color:blue;
        	}
        </style>
    </head>
    <body>
        <h2>基本动画效果</h2>
        <div></div>
        <input type="button" value="隐藏" onclick="f1()" />
        <input type="button" value="显示" onclick="f2()" />
        <input type="button" value="开关" onclick="f3()" />
    </body>
</html>